import Vue from 'vue'
import VueRouter from 'vue-router'
import HomeView from '../views/HomeView.vue'

Vue.use(VueRouter)/*启用路由功能*/

const routes = [
    /*路由地址只有一个斜线(/)的时候，这个路由一定放在规则数组的第一项*/
  {
    path: '/',
    name: 'home',
    component: HomeView
  },
  {
    path: '/about',
    name: 'about',
    component: () => {
      return import("../views/AboutView")
    }
  },{
    path: "/info",
    name:"info",
    component: () => import("../views/InfoView")
  },{
    path:"/xinwen",
    name:"liudehua",
    component: ()=>import("../views/NewsView")
  },{
    path:"/admin",
    name:"admin",
    component: ()=>import("../views/AdminView"),
    /*该路由规则重新定向到新的路由中*/
    redirect:"/admin/page1",
    children:[{
      /*子级路由的path属性，不能以斜线(/)开头，应该直接写子路由的地址*/
      path:"page1",
      name:"page1",
      component:()=>import("../views/admin/Page1")
    },{
      path:"page2",
      name: "page2",
      component:()=>import("../views/admin/Page2")
    }]
  },
  // {
  //   path:"/admin/page1",
  //   name:"page1",
  //   component: ()=>import("../views/admin/Page1")
  // }
  {
    path: "/axios",
    name:"axios",
    component: ()=>import("../views/Axios")
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

/*前置路由守卫*/
router.beforeEach(((to, from, next) => {
  console.log("to",to);
  console.log("from",from);
  /*强制让新闻转向admin地址*/
  if(to.path === "/xinwen"){
    next("/admin")
  }else{
    /*路由守卫中必须调用next方法，否则这个路由将会失效*/
    next();
  }
  /*实际业务开发中，这里的处理一般是未登录则强制跳转到登录页，已登录则放行*/
}));
export default router
